<template>
  <div class="app-container">
    <div class="filter-container">
      <span>房间名称</span>
      <el-input
        v-model="roomlist.name"
        placeholder="请输入房间名称"
        style="width: 60%; margin-right: 20px"
        class="filter-item"
      />
    </div>
    <div class="filter-container">
      <span>房间号</span>
      <el-input
        v-model="roomlist.chat_number"
        placeholder="请输入房间号"
        style="width: 60%; margin-right: 20px"
        class="filter-item"
      />
    </div>
    <div class="filter-container">
      <span>所属公会</span>
      <el-input
        v-model="roomlist.guild_name"
        placeholder="请输入所属公会"
        style="width: 60%; margin-right: 20px"
        class="filter-item"
      />
    </div>
    <el-button class="filter-item" type="primary" @click="confirm">
      确认
    </el-button>
  </div>
</template>

<script>
import {
  encryption2
} from '@/api/index'
export default {
  name: 'ComplexTable',
  data() {
    return {
      // 渠道
      roomlist: {
        chat_number: '72406398',
        created: '2020-04-20 20:03:05',
        guild_name: '测试公会',
        name: '我123456',
        nickname: '我在这里等你',
        roomId: 79,
        total_money: 0
      }
    }
  },
  created() {
    this.roomlist = this.$store.getters.roomlist
  },
  methods: {
    confirm() {
      // this.$store.dispatch("api/deleteroomlist");
      // console.log(this.$store.getters.roomlist);
      // const arys = {
      //   roomName: this.channels.channelName // 房间名称
      // }
      // const url = '/room/addRoom'
      // encryption2(arys, url).then((res) => {
      //   if (res.data.status === 0) {
      //     this.$message({
      //       message: res.data.text,
      //       type: 'success'
      //     })
      //     this.$router.go(-1)
      //   } else {
      //     this.$message({
      //       message: res.data.text,
      //       type: 'error'
      //     })
      //   }
      // })
    }
  }
}
</script>
<style scoped>
  .filter-container {
    width: 1000px;
    display: flex;
    align-items: center;
  }

  .filter-container>span {
    width: 100px;
    font-size: 16px;
    font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
      "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  }

  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }

  .avatar-uploader .el-upload:hover {
    border-color: #409eff;
  }

  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }

  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>
